How to reference {{outlet}} in Ember.CollectionView's itemView

Posted by ceed on Stack Overflow See other posts from Stack Overflow or by ceed
Published on 2013-10-18T21:58:04Z Indexed on 2013/10/19 3:55 UTC
Read the original article Hit count: 157

Filed under:

I am new to ember and ran into a problem and could not find an answer online.

I have a collectionView

App.MyView = Ember.CollectionView.extend({
    itemViewClass: 'App.MyViewItem',
    contentBinding: 'controller'
});

and the itemViewClass

App.MyViewItem = Ember.View.extend({
    templateName: 'mytemplate'
});

the template looks like that:

<div {{action 'select' view.content}}>{{view.content.name}}</div>
        {{outlet detail}}
</div>

This produces the content list just fine.

In the controller, I have an action:

select: function(evt){
            this.transitionToRoute('item', evt);
        }

What I want to do is to transition to a nested route when selecting the item (which works fine) and also load more data of the selected item into {{outlet detail}}. While I can load the content of the "item" route into an outlet of e.g. application.hbs, I don't know how to reference the outlet of the selected collectionView item so that the detailed contents are displayed within the existing view.

I tried to use:

this.render('item', {
            outlet: 'detail',
            into: '????'
        });

within the item Route, but I don't know how to reference the collectionview item template.

Maybe there's also a much easier way of loading more data from an item in the item's view (while changing the route at the same time). Any help would be appreciated.

© Stack Overflow or respective owner

Related posts about ember.js